<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <style type="text/css">
    body{
         background: #e9ecf3;
    }
    .phone{
    	margin: 0 auto;
    	width: 360px;
    }
       .pre_show {
            width: 360px;
            height: 639px;
            border: 1px solid red;
            margin:0 auto;
            background: #fff;
        }
        .sign{
        	width: 360px;
        	height: 25px;
         background:url(../images/left_nav/pre_show_logo.png);*/
        }
    

        .pre_body {
            width: 340px;
            height: 610px;
            border: 1px solid black;
            margin: 0 auto;
        }
        .head {
            width: 340px;
            height: 117px;
            background: #b1d1d2;
            border: 1px solid blue;
            margin: 0 auto;
        }

        .shop_name {
            margin-top: 10px;
            width: 340px;
            height: 70px;
            border: 1px solid blue;
            position: relative;
        }

        .logo {
            width: 70px;
            height: 68px;
            background: #ffbb84;
            float: left;

        }

        .name {
            width: 70px;
            height: 68px;
            float: left;
            margin: 16px 0px 0px 10px;

        }

        .score {
            width: 74px;
            height: 43px;
            float: right;
            margin-top: 16px;
        
            border: 1px solid red;
        }

        .score button {
            background: #fff06e;
            float: right;
        }

        .position_title {
            width: 340px;
            height: 20px;
            border: 1px solid blue;
            margin: 10px 0px;
            clear: both;
        }

        .position_icon {
            width: 20px;
            height: 20px;
            float: left;
            background: #5CC7CB;
        }
        .title{
             display:block;
             width: 120px;
        	 margin-left: 30px;
        	border: 1px solid red;
        }
        .classify{
        	width: 340px;
        	height: 70px;
        	background: #F0F0F0;
            margin:0 auto;
        }
        .classify_logos{
        	margin: 0 auto;
        	border: 1px solid red;
           overflow: hidden;
        }
        #side{
        	margin-left:23px;
        }
        .classify_logo{
        	width: 30px;
        	height: 30px;
        	background: #fff;
        	float: left;
        	margin-right: 33px;
        	margin-top: 20px;
        }
        .divide{
        	width: 340px;
        	background: #D6D6D6;
            height: 10px;
            margin-top: 10px;

        }
        .activity{
        	width: 340px;
        	height: 80px;
        	font-size:11px;
        	text-align: center;
        	border: 1px solid yellow;

        }
        .product_show{
        	width: 340px;
        	height: 100px;
            clear: both;
        	border: 1px solid red;
        }
        .product_img{
        	width: 100px;
        	height: 100px;
        	background: #d6d6d6;
        	float: left;
   	        margin-right: 17px;
            border: 1px solid blue;
        
        }
        .product_img:nth-child(3n){
        	margin-right: 0px;
        }
        .phone_button{
        width: 120px;
        height: 40px;
        text-align: center;
        margin-top:30px;
        margin-right: 40px; 
        font-size:14px;
        }
        .phone_button:nth-child(2n){
        	margin-right: 0px;
        }
       #fresh{
          background: #fff;
       }
       #publish{
        background: #5CC7CB;
       }
       .phone_footer{
       	width: 290px;
       	margin: 0 auto;

       }
    </style>
</head>
<body>
<div class="bagel" >
        <span>后台管理</span>><span>多栏编辑</span>
</div>
<div class="phone">

<div class="pre_show">

 <div class="sign">

 </div>
    <div class="pre_body">
        <div class="head">
       
        </div>
        <div class="shop_name">
            <div class="logo">
            </div>
            <div class="name">
                名称<br>
                主营业务
            </div>
            <div class="score">
                评分<span><img src="../images/left_nav/pre_star.png"></img></span>
                <button>+关注</button>
            </div>
        </div>
        <div class="position_title">
            <div class="position_icon">

            </div>

            <span class="title">具体位置</span>
        </div>
        <div class="classify">
             <div class="classify_logos">
        	 <div class="classify_logo" id="side">
        	 	
        	 </div>
        	  <div class="classify_logo">
        	 	
        	 </div>
        	  <div class="classify_logo">
        	 	
        	 </div>
        	  <div class="classify_logo">
        	 	
        	 </div>
        	  <div class="classify_logo">
        	 	
        	 </div>
        	 </div>
        </div>
        <div class="divide">
        	
        </div>
          <div class="position_title">
            <div class="position_icon">

            </div>

            <span class="title">优惠活动</span>
        </div>
        <div class="activity">
        	活动信息：新品上架，限时优惠九折，新品上架，限时优新品上架<br>
        	活动信息：新品上架，限时优惠九折，新品上架，限时优新品上架<br>
        	活动信息：新品上架，限时优惠九折，新品上架，限时优新品上架<br>
        	活动信息：新品上架，限时优惠九折，新品上架，限时优新品上架<br>
        	   <hr></hr>
        </div>

         <div class="position_title">
            <div class="position_icon">

            </div>

            <span class="title">商品展示</span>
        </div>
        <div class="product_show">
           
        	 <div class="product_img">
        	 	
        	 </div>
        	  <div class="product_img">
        	 	
        	 </div>
        	  <div class="product_img">
        	 </div> 	
        </div>
    </div>
</div>
<div class="phone_footer">
<input type="button" value="刷新" class="phone_button" id="fresh"></input>
<input type="button" value="发布"  class="phone_button" id="publish"></input>
<div>
</div>
</body>
</html>